.subject {
    width: 90%;
    margin: auto;
    overflow: auto;
    display: block;
    display: flex;
}

.subject_topics {
    width: 80%;
    overflow: auto;
    border-radius: 2px;
    border: 1px solid black;
}

.subject_topic {
    display: block;
    display: flex;
    width: 100%;
    height: 50px;
    line-height: 50px;
}

.subject_select {
    width: 20%;
    height: 100%;
    border-radius: 0px 5px 5px 0px;
    background: rgb(224, 224, 224);
}

.degree {
    width: 10%;
    height: 100%;
    margin-left: 10px;
}

.subject_search {
    margin-left: 25%;
    width: 40%;
    height: 100%;
}

.subject_random {
    width: 20%;
    height: 100%;
    border-radius: 5px;
    margin-left: 5%;
}

.subject_state,
.states {
    display: block;
    display: flex;
    width: 100%;
    height: 50px;
    line-height: 50px;
    border: 1px solid black;
}

.state1 {
    margin-left: 6%;
}

.state2 {
    margin-left: 8%;
}

.state3 {
    margin-left: 22%;
}

.state4 {
    margin-left: 32%;
}

.state5 {
    width: 16%;
    text-align: center;
    line-height: 50px;
    border: 1px solid black;
}

.state6 {
    width: 25%;
    border: 1px solid black;
}

.state7 {
    width: 35%;
    border: 1px solid black;
}

.state8 {
    width: 25%;
    border: 1px solid black;
}

.discuss_related {
    width: 18%;
    height: 800px;
    margin-left: 2%;
    background: #fff177;
    border: 2px solid black;
}

.discuss_s,
.discuss_x {
    width: 90%;
    height: 225px;
    margin: 5% auto;
    border-radius: 5%;
    border: 2px solid black;
}

.discuss_s span,
.discuss_x span {
    display: inline-block;
    width: 90%;
    line-height: 40px;
    height: 40px;
    border-radius: 5%;
    margin: auto;
    background: #fff;
    margin-top: 7%;
    box-shadow: 5px 5px 5px 5px #ccc;
}

.discuss_s p,
.discuss_x p {
    margin-top: 8%;
    margin-left: -50%;
}